import 'antd/dist/antd.css';
import {  useDispatch, useSelector ,TagModelState} from 'umi';
import { useEffect } from 'react';
import './articleCord.less'
function StickyCardTag() {
  // 通过useSelector获取model数据
  const tag = useSelector((state: { tagList: TagModelState }) => state.tagList);
  // 通过useDispatch获取dispatch
  const dispatch = useDispatch();
  useEffect(()=>{
    dispatch({
      type:'tagList/getTagList'
    })
  },[])
  return <div className="sticky">
    <div className="stickyTags">
      <div className="stickyTitle_bottom">
        <span>文章标签</span>
      </div>
      <div className="stickyTagsList">
        <ul>
        {
          tag.tagList&&tag.tagList.map((item,index)=>{
            return <li key={index}>
              <a href={`/tag/${item.value}`}>{item.label} [{item.articleCount}]</a>
            </li>
          })
        }
        </ul>
      </div>
    </div>
  </div>
}
export default StickyCardTag